<template>
  <a-modal 
    :visible="visible"
    :title="title"
    okText="确定" 
    cancelText="取消"
    :maskClosable="false"
    :destroyOnClose="true"
    :keyboard="false"
    @cancel="closeModal()"
    @ok="handleSubmit"
    width="600px">
    <a-table 
        :pagination="false"
        :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: handleSelectChange }"
        :columns="columns" 
        :data-source="tableData"
        :rowKey="record=>record.id">
      </a-table>
  </a-modal>
</template>

<script>
export default {
  components:{
    
  },
  props: {
    visible:{
      type:Boolean,
      default:false,
    },
    selectedKeys:{
      type:Array,
      default(){
        return [];
      }
    }
  },
  computed:{
    title(){
      return '选择会员等级';
    }
  },
  data () {
    return {
      selectedRowKeys:[],
      columns:[
          {
              title:'会员等级名称',
              dataIndex:'gradeName',
              key:'gradeName',
          }
      ],
      tableData:[],
    }
  },
  watch: {
    visible(newVal){
      if(newVal){
        console.log('this.selectedKeys',this.selectedKeys);
        this.selectedRowKeys=this.selectedKeys;
       this.getListData();
      }
    }
  },
  created(){
    
  },
  mounted () {
  },
  methods: {
    closeModal (freshTable) {
      this.$emit('cancel', freshTable)
    },
    async getListData(){
      let res=await this.$get('/coupon/getmemberlevels');
      if(res && res.returnCode=='1000'){
        this.tableData=res.dataInfo || [];
      }
    },
    handleSelectChange(selectedRowKeys) {
      console.log('selectedRowKeys changed: ', selectedRowKeys);
      this.selectedRowKeys = selectedRowKeys;
    },
    handleSubmit(){
      console.log('this.selectedRowKeys',this.selectedRowKeys);
      this.$emit('submit',this.selectedRowKeys);
    }
  }
}
</script>

<style lang="less" scoped>

</style>
